{include file="head" title="图片添加" /}
    <div class="layui-fluid">
        <div class="layui-card">
            <div class="layui-card-header">图片添加</div>
            <div class="layui-card-body" style="padding: 15px;">
                <form id="form" class="layui-form" action="{:url('piclists/piclist_submit');}" enctype="multipart/form-data" method="post" style="width:50%;">
                    <input type="hidden" name="id" value="" />
                    <div class="layui-form-item">
                        <label class="layui-form-label">图片分类</label>
                        <div class="layui-input-block">
                            <select name="type_id" id="type_id" >
                                <!--<option value="">/</option>-->
                                    {foreach $pictype as $v } 
                                        <option value="{$v.id}">{$v.name}</option>
                                    {/foreach}    
                            </select>
                        </div>
                    </div>
                    <!--
                    <div class="layui-form-item">
                        <label class="layui-form-label">名称：</label>
                        <div class="layui-input-block">
                            <input type="text" name="name" value="" lay-verify="required" autocomplete="off" placeholder="请输入名称" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">介绍：</label>
                        <div class="layui-input-block">
                            <input type="text" name="note" value=""  autocomplete="off" placeholder="请输入介绍" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">链接：</label>
                        <div class="layui-input-block">
                            <input type="text" name="url" value="" autocomplete="off" placeholder="请输入链接" class="layui-input">
                        </div>
                    </div>
                    -->
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">排序</label>
                            <div class="layui-input-inline">
                                <input type="number" name="sort" value="100" autocomplete="off" class="layui-input">
                            </div>
                            <div class="layui-form-mid layui-word-aux">值大靠前</div>
                        </div>
                    </div>
                    <fieldset class="layui-elem-field">
                        <legend>图片</legend>
                        <div class="layui-field-box">
                            <div class="layui-upload">
                                <button type="button" class="layui-btn" id="test1">选择图片</button>
                                <input type="hidden" id="pic" name="pic" value="" />
                                <div class="layui-upload-list">
                                    <!--<a href="" target="_blank"><img class="layui-upload-img" id="demo1" style="width:150px" src=""></a>-->
                                    <img class="layui-upload-img" id="demo1" style="width:150px" src="">
                                    <p id="demoText"></p>
                                </div>
                            </div>
                        </div>
                    </fieldset>
                    <div class="layui-form-item">
                        <div class="layui-input-block">
                            <button class="layui-btn" lay-submit="" lay-filter="sub">立即提交</button>
                            <button type="button" class="layui-btn layui-btn-primary" onclick="javascript:history.back(-1)">返回</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>

<script>
    layui.config({
        base: '{$Think.const.admin_tpl}/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'form', 'laydate','upload'], function () {
        var $ = layui.$
                , layer = layui.layer
                , form = layui.form
                , upload = layui.upload;

        /* 监听提交 */
        form.on('submit(sub)', function (data) {
            console.log($("#form").serialize());
            $.ajax({
                url: "/admin/piclists/piclist_submit/",
                type: 'post',
                data: $("#form").serialize(),
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                    if(data.status==1)
                    {
                        layer.confirm('操作成功！请选择？', {
                            btn: ['继续添加','返回列表'] //按钮
                          }, function(){
                              location.reload();
                          }, function(){
                              location.href = '/admin/piclists/index.html';
                          });
                    }
                    else
                    {
                        layer.msg(data.msg);
                    }
                },
                error: function (msg) {
                    alert(" 数据保存失败！" + msg);
                }
            });
            return false;
        });

        //缩略图
    var uploadInst = upload.render({
        elem: '#test1'
        , url: '/admin/files/upload_post/'
        , field: 'Filedata'
        , before: function(obj) {
            //预读本地文件示例，不支持ie8
            obj.preview(function(index, file, result) {
                $('#demo1').attr('src', result); //图片链接（base64）
            });
        }
        , done: function(res) {
            //如果上传失败
            if (res.code > 0) {
                return layer.msg('上传失败');
            }
            //上传成功
            $("#pic").val(res.file);
        }
        , error: function() {
            //演示失败状态，并实现重传
            var demoText = $('#demoText');
            demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
            demoText.find('.demo-reload').on('click', function() {
                uploadInst.upload();
            });
        }
    });
    });
</script>
{include file="foot" /}